<!doctype html>

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>Chapter 2 - Designing a layout using CSS grids</title>

  <link rel="stylesheet" href="styles.css?v=1.0">

</head>

<body>
  <main>
    <header>
      <img src="./img/logo.jpg" alt="">
      <h1>Sonnets by William Shakespeare</h1>
    </header>
    <article>
      <h2>
        Sonnet 1
        <br><small>by William Shakespeare</small>
      </h2>
      <p>
        <span>From fairest creatures we desire increase,</span>
        <span>That thereby beauty's rose might never die,</span>
        <span>But as the riper should by time decease,</span>
        <span>His tender heir might bear his memory:</span>
        <span>But thou contracted to thine own bright eyes,</span>
        <span>Feed'st thy light's flame with self-substantial fuel,</span>
        <span>Making a famine where abundance lies,</span>
        <span>Thy self thy foe, to thy sweet self too cruel:</span>
        <span>Thou that art now the world's fresh ornament,</span>
        <span>And only herald to the gaudy spring,</span>
        <span>Within thine own bud buriest thy content,</span>
        <span>And, tender churl, mak'st waste in niggarding:</span>
        <span>Pity the world, or else this glutton be,</span>
      </p>
    </article>
    <aside>
      <section>
        <img src="./img/image-1.jpg" alt="">
        <h3>Sonnet 2</h3>
        <p>
          When forty winters shall besiege thy brow,
          <br>And dig deep trenches in thy beauty's field, ...
        </p>
        <a href="">Read more of Sonnet 2</a>
      </section>
      <section>
        <img src="./img/image-2.jpg" alt="">
        <h3>Sonnet 3</h3>
        <p>
          Look in thy glass and tell the face thou viewest,
          <br>Now is the time that face should form another, ...
        </p>
        <a href="">Read more of Sonnet 3</a>
      </section>
    </aside>
    <section class="author-details">
      <h3>
        <small>About the Author</small>
        <br>William Shakespeare
      </h3>
      <p>English playwright, poet, and actor who lived from 1564 to 1616. He is credited for having authored Romeo and
        Juliet.</p>
    </section>
    <section class="plays">
      <img src="./img/play.jpg" alt="">
      <h3>Checkout out his plays:</h3>
      <ul>
        <li><a href="">All's Well That Ends Well</a></li>
        <li><a href="">As You Like It</a></li>
        <li><a href="">Cymberline</a></li>
      </ul>
    </section>
    <footer>
      <p>Want to read more of Shakespeare's works, check out his complete works on the <a
          href="https://www.gutenberg.org/ebooks/100">Project Gutenberg</a>.</p>
    </footer>
  </main>
</body>

</html>
